<script type="text/javascript">
//此处想实现左栏导航，未能成功
/*	angular.module('anchorApp',[]).controller('anchorCtrl',['$scope','$location','$anchorScroll',function ($scope,$location,$anchorScroll){$scope.gotoanchor=function(){
		$location.hash('selfevaluation');
		$anchorScroll();
      };
  }]);*/
angular.module('anchorApp',[]).run(['$anchorScroll'],function($anchorScroll){
	$anchorScroll.yOffset=50;
}).controller('anchorCtrl',['$anchorScroll'],'$location','$scope',function($anchorScroll,$location,$scope){
	$scope.gotoanchor=function(x){
		$location.hash(x);
		$anchorScroll();
	}
	
});
</script>
<style type="text/css">
	ul.nav-tabs{
        width: 140px;
        margin-top: 20px;
        border-radius: 4px;
        border: 1px solid #ddd;
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.067);
    }
    ul.nav-tabs li{
        margin: 0;
        border-top: 1px solid #ddd;
    }
    ul.nav-tabs li:first-child{
        border-top: none;
    }
    ul.nav-tabs li a{
        margin: 0;
        padding: 8px 16px;
        border-radius: 0;
    }
    ul.nav-tabs li.active a, ul.nav-tabs li.active a:hover{
        color: #fff;
        background: #0088cc;
        border: 1px solid #0088cc;
    }
    ul.nav-tabs li:first-child a{
        border-radius: 4px 4px 0 0;
    }
    ul.nav-tabs li:last-child a{
        border-radius: 0 0 4px 4px;
    }
    ul.nav-tabs.affix{
        top: 30px;
    }
    label{
    	font-weight: normal;
    }
    address{
    	line-height: 200%;
    	font-size: 120%;
    }
</style>
<div data-spy="scroll" data-target="#myScrollspy">
	<div class="container">
	<div class="panel panel-primary">
		<div class="panel-heading text-center"><h2>李雷的简历</h2></div>
	</div>
	<div class="row">
    <div class="col-xs-3" id="myScrollspy" ng-app='anchorApp' ng-controller='anchorCtrl'>
		<ul class="nav nav-tabs nav-stacked" data-spy="affix" data-offset-top="125">
			<li class="active"><a ng-click="gotoanchor('perinformation')">个人信息</a></li>
			<li><a ng-click="gotoanchor('awardcertificate')">获奖证书</a></li>
			<li><a ng-click="gotoanchor('personalskills')">专业技能</a></li>
			<li><a ng-click="gotoanchor('eduexperience')">教育经历</a></li>
			<li><a ng-click="gotoanchor('worexperience')">工作经验</a></li>
			<li><a ng-click="gotoanchor('hobby')">兴趣爱好</a></li>
			<li><a ng-click="gotoanchor('selfevaluation')">自我评价</a></li>
			<li><a ng-click="gotoanchor('contactme')">联系方式</a></li>
		</ul>	
	</div>
	<div class="col-xs-9">
	<h3 id="perinformation">个人信息</h3>
		<div class="row">
			<div class="col-xs-12">
				<table class="table">
					<tr>
						<td>姓名：</td>
						<td><input type="text" value="李雷"></td>
						<td rowspan="2" align="right"><img src="../images/lilei.png" class="img-responsive" alt="lilei's picture" style="float:right"></td>
					</tr>
					<tr>
						<td>性别：</td>
						<td><select><option value="male">男</option><option value="female">女</option></select></td>
					</tr>
					<tr>
						<td>出生年月：</td>
						<td><input type="text"></td>
						<td>民族：</td>
						<td><select><option value="han">汉</option><option value="meng">蒙</option><option value="hui">回</option><option value="zang">藏</option><option value="etc">...</option></select></td>
					</tr>
					<tr>
						<td>籍贯：</td>
						<td><input type="text"></td>
						<td>政治面貌:</td>
						<td><select><option value="dang">中共党员</option><option value="yubei">中共预备党员</option><option value="tuan">共青团员</option><option value="numal">群众</option><option value="minmeng">民盟</option><option value="etc">...</option></select></td>
					</tr>
				</table>
			</div>
		</div>
		<div style="margin-bottom:180px">
		<h3 id="awardcertificate">获奖证书</h3>
		<div class="row" style="float:left">
		<hr>
			<div class="col-sm-2"><label>证书1</label></div>
			<div class="col-sm-4"><input type="text"></div>
			<div class="col-sm-2"><label>证书2</label></div>
			<div class="col-sm-4"><input type="text"></div>
		</div>
		<div class="row" style="float:left">
		<hr>
			<div class="col-sm-2"><label>证书3</label></div>
			<div class="col-sm-4"><input type="text"></div>
			<div class="col-sm-2"><label>证书4</label></div>
			<div class="col-sm-4"><input type="text"></div>
		</div>
		</div>
	<div>
		<h3 id="personalskills">专业技能</h3>
		<div class="row" style="float:left">
		<hr>
			<div class="col-sm-2"><label>技能1</label></div>
			<div class="col-sm-4"><input type="text"></div>
			<div class="col-sm-2"><label>技能2</label></div>
			<div class="col-sm-4"><input type="text"></div>
		</div>
		<div class="row" style="float:left">
		<hr>
			<div class="col-sm-2"><label>技能3</label></div>
			<div class="col-sm-4"><input type="text"></div>
			<div class="col-sm-2"><label>技能4</label></div>
			<div class="col-sm-4"><input type="text"></div>
		</div>
	</div>
		<div style="margin-top:180px" class="panel-group" id="education">
			<h3 id="eduexperience">教育经历</h3>
			<div class="panel panel-default">
				<div class="panel-heading">
					<h4 class="panel-title">
						<a href="views/resume.html#education1" data-toggle="collapse" data-parent="#education">教育经历1</a>

					</h4>
				</div>
				<div id="education1" name="education1" class="panel-collapse collapse in">
					<div class="panel-body">
						XXXX年XX月至XXXX年XX月，在XXXX就读。
					</div>
				</div>
			</div>
			<div class="panel panel-default">
				<div class="panel-heading">
					<h4 class="panel-title">
						<a href="views/resume.html#education2" data-toggle="collapse" data-parent="#education">教育经历2</a>

					</h4>
				</div>
				<div id="education2" class="panel-collapse collapse in">
					<div class="panel-body">
						XXXX年XX月至XXXX年XX月，在XXXX就读。
					</div>
				</div>
			</div>
			<div class="panel panel-default">
				<div class="panel-heading">
					<h4 class="panel-title">
						<a href="views/resume.html#education3" data-toggle="collapse" data-parent="#education">教育经历3</a>

					</h4>
				</div>
				<div id="education3" class="panel-collapse collapse in">
					<div class="panel-body">
						XXXX年XX月至XXXX年XX月，在XXXX就读。
					</div>
				</div>
			</div>
		</div>
		<div>
			<h3 id="worexperience">工作经验</h3>
			<button type="button" class="btn btn-info" data-toggle="collapse" data-target="#workexperience1">
			工作经验1
			</button><br>
			<div id="workexperience1" class="collapse in">
				XXXX年XX月至XXXX年XX月，在XXXX公司，任职XXXX
			</div>
			<hr>
			<button type="button" class="btn btn-info" data-toggle="collapse" data-target="#workexperience2">
			工作经验2
			</button><br>
			<div id="workexperience2" class="collapse in">
				XXXX年XX月至XXXX年XX月，在XXXX公司，任职XXXX
			</div>
			<hr>
			<button type="button" class="btn btn-info" data-toggle="collapse" data-target="#workexperience3">
			工作经验3
			</button>
			<div id="workexperience3" class="collapse in">
				XXXX年XX月至XXXX年XX月，在XXXX公司，任职XXXX
			</div>
		</div>
		<div>
			<h3 id="hobby">兴趣爱好</h3>
			<textarea rows="3" cols="80">打篮球，踢足球，唱歌，跳舞，远足，爬山</textarea>
		</div>
		<div>
			<h3 id="selfevaluation">自我评价</h3>
			<textarea rows="3" cols="80">活泼开朗、乐观向上、兴趣广泛、适应力强、上手快、勤奋好学、脚踏实地、认真负责、坚毅不拔、吃苦耐劳、勇于迎接新挑战。</textarea>
		</div>
		<div>
			<h3 id="contactme">联系方式</h3>
			<address>				
				<abbr title="phone"><span class="glyphicon glyphicon-phone"></span>电话：</abbr>13965518762<br>
				<span class="glyphicon glyphicon-home">地址：江苏省苏州市高新区科灵路78号</span><br>
				<span class="glyphicon glyphicon-envelope"></span>邮箱：<a href="mailto:#">mail@somedomain.com</a>
			</address>
		</div>
	</div>	
	</div>
	</div>
</div>
</div>